﻿<!DOCTYPE html>
<html lang="en">

<head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>字和句关于你</title>

	<link href="css/default.css" type="text/css" rel="stylesheet">
	<script type="text/javascript" src="js/jquery.js"></script>
	<script type="text/javascript" src="js/garden.js"></script>
	<script type="text/javascript" src="js/functions.js"></script>

</head>

<body>

	<div id="mainDiv">
		<!-- <video id="bgmusic" src="./css/陈卓璇 - 字和句关于你 (Live).mp3" controls="controls" autoplay loop="true"
			hidden="true">
		</video> -->
		<iframe class="mis" frameborder="no" border="0" marginwidth="0" marginheight="0" width=298 height=52 src="http://music.163.com/outchain/player?type=2&id=1883729882&auto=1&height=32"></iframe>
		<div id="content">
			<div id="code">
				<span class="comments">/**</span><br />
				<span class="space" /><span class="comments">*2007—09-01,</span><br />
				<span class="space" /><span class="comments">*<span id="time"></span>.</span><br />
				<span class="space" /><span class="comments">*/</span><br />
				<span class="keyword">什么是缘？</span><br />
				相聚是缘<br />
				<br>
				<span class="keyword">什么是分？</span><br />
				相伴是分<br />
				<br>
				<br>
				我们未曾有过联系。<br />
				但冥冥之中月老好似给我们焊了铁链。 <br />
				我总是在不知不觉的生活中看得见你的身影。<br />
				小学时的同班。 <br />
				初中时的隔壁班。 <br />
				高中时的上下楼。 <br />
				大学时的不同校区。 <br />
				<br>
				<br>
				<span class="keyword">I love three things in this world,</span><br />
				浮世万千，吾爱有三，<br />
				<br>
				<span class="keyword">the sun, the moon and you.</span><br />
				一为日，二为月，三为卿。<br />
				<br>
				<span class="keyword">The sun for the day,</span><br />
				日为朝，<br />
				<br>
				<span class="keyword">the moon for the night,</span><br />
				月为暮，<br />
				<br>
				<span class="keyword">and you forever,</span><br />
				卿为朝朝暮暮。<br />
				<br>
			</div>
			<div id="loveHeart">
				<canvas id="garden"></canvas>
				<div id="words">
					<div id="messages">
						这是我们相识的时光
						<div id="elapseClock"></div>
					</div>
					<div id="loveu">
						FALL IN FALL,<br />
						<div class="signature">FALL IN LOVE</div>
					</div>
				</div>
			</div>
		</div>
		<div id="copyright">
			<span>&copy;&nbsp;CHEN <a class="linkText" href="./love.html">biu~~</a></span>
		</div>
	</div>

	<script>
		var nowDate
		var date
		function getNowDate(time) {
			const date = new Date(time);
			const y = date.getFullYear();
			let MM = date.getMonth() + 1;
			MM = MM < 10 ? `0${MM}` : MM;
			let d = date.getDate();
			d = d < 10 ? `0${d}` : d;
			return `${y}-${MM}-${d}`;
		};
		date = new Date().getTime()
		nowDate = getNowDate(date)
		console.log('nowDate', nowDate)
		document.getElementById("time").innerHTML = nowDate;

		// function toggleSound() {
		// 	var music = document.getElementById("bgmusic");
		// 	if (music.paused) {
		// 		music.paused = false;
		// 		music.play();
		// 	}
		// }

		// function clickScreen() {
		// 	let odiv = document.getElementById("mainDiv");
		// 	odiv.onclick = function() {
		// 		console.log('自动点击屏幕')
		// 	}
		// 	odiv.click()
		// }

		// setInterval(function() {
		// 	toggleSound()
		// }, 1)

		// setTimeout(function() {
		// 	clickScreen()
		// }, 100)
	</script>
	<script type="text/javascript">
		var offsetX = $("#loveHeart").width() / 2;
		var offsetY = $("#loveHeart").height() / 2 - 55;
		var together = new Date();
		together.setFullYear(2007, 9, 1);
		together.setHours(20);
		together.setMinutes(0);
		together.setSeconds(0);
		together.setMilliseconds(0);

		if (!document.createElement('canvas').getContext) {
			var msg = document.createElement("div");
			msg.id = "errorMsg";
			msg.innerHTML = "Your browser doesn't support HTML5!<br/>Recommend use Chrome 14+/IE 9+/Firefox 7+/Safari 4+";
			document.body.appendChild(msg);
			$("#code").css("display", "none")
			$("#copyright").css("position", "absolute");
			$("#copyright").css("bottom", "10px");
			document.execCommand("stop");
		} else {
			setTimeout(function () {
				startHeartAnimation();
			}, 5000);

			timeElapse(together);
			setInterval(function () {
				timeElapse(together);
			}, 500);

			adjustCodePosition();
			$("#code").typewriter();
		}
	</script>

</body>

</html>